import { createVNode,render } from "../assets/vue3/vue.esm-browser.js";

let callback = function (el, binding) {
    // console.log("preload:",el,binding)
    let imgSrc = binding.value;
    let cusStyle = el.style.cssText;
    el.style.cssText = cusStyle + "object-fit: scale-down;object-position: center;background-color: #dedede;";
    let tempImg = new Image();
    tempImg.src = imgSrc
    tempImg.onload = function () {
        el.src = imgSrc;
        el.style.cssText = cusStyle;
    }
    tempImg.onerror = function () {
        el.src = "../assets/img/notfoud.png";
    }
}
let test = function(){
    console.log(1)
}

let message =function(msg = "默认消息") {
    let msgVnode = createVNode({
        template: `<div class="msg-box">{{ msg }}</div>`,
        data() {
            return {
                msg
            }
        },
        mounted() {
            setTimeout(() => {
                document.body.removeChild(this.$el)
            }, 3000)
        },
    })
    let box = document.createDocumentFragment();
    render(msgVnode, box);
    document.body.appendChild(box)
}

// export default {
//     install:function(app){
//         console.log("install:",app)
//         app.directive("preload",callback)
//         app.directive("test",test)
//         app.config.globalProperties.$message = message
//     }
// }
export default function(app){
    console.log("install:",app)
    app.directive("preload",callback)
    app.directive("test",test)
    app.config.globalProperties.$message = message
}